import { ref, computed } from 'vue';

export default function useEditTodo(todosRef) {
  const editingTodoRef = ref(null); // 当前正在修改的是哪一个todo
  let originTitle = null; // 缓存之前的title值
  const editTodo = (todo) => {
    originTitle = todo.title;
    editingTodoRef.value = todo;
  };
  const doneEdit = (todo) => {
    editingTodoRef.value = null;
    const title = todo.title.trim();
    if (title) {
      todo.title = title;
    } else {
      // 删除
      const index = todosRef.value.indexOf(todo);
      if (index >= 0) {
        todosRef.value.splice(index, 1);
      }
    }
    console.log(todosRef.value);
  };
  const cancelEdit = (todo) => {
    editingTodoRef.value = null;
    todo.title = originTitle;
  };
  const allDoneRef = computed(() => {
    var val = todosRef.value.filter((it) => !it.completed).length === 0;
    return val;
  });
  function setAllChecked(checked) {
    todosRef.value.forEach((todo) => {
      todo.completed = checked;
    });
  }
  return {
    editingTodoRef,
    editTodo,
    doneEdit,
    cancelEdit,
    allDoneRef,
    setAllChecked,
  };
}

// 在文档计算属性章节，有一个最佳实践
// vue3官网对于计算属性的最佳实践，意思就是不要对计算属性赋值，只允许写getter，袁老师最开始使用了计算属性赋值完成上面的功能，后面改了
// 并且说明vue3既然说明了不要对计算属性赋值，但是并没有标记过期或者去掉该api，对这种做法不理解，因为一个成熟的框架不应该这样做，背后的原因不得而知
// 但是vue2没有这个限制，所以说vue2和vue3对于计算属性，有一点概念上的细微区别，具体看文档，写的很抽象，什么临时快照，派生状态
// 但是我觉得官方文档写的挺好的，确实修改计算属性没啥意义，应该去修改firstName和lastName，而不是去修改fullName。虽然vue3没有去掉这个api也没有标记过期
// 但是既然建议永远不更改计算属性，成熟的框架应该标记过期或者去掉这个api，反正vue3已经是截断式更新了，老师的疑问也是有道理的
/**
 * @deprecated 过期，以后可能会移除，不直接去掉是因为避免兼容性问题
 */
function abc() {}

abc();